<template>
	<div class="page pageBackground home">
		<template v-if="!gradeShow&&!gradeListShow&&!gradeMeberShow&&!treasureShow&&!treasureDetailShow&&!recordShow&&!treasurePrizeShow">
			<div class="logo flex a-center">
				<img src="../../assets/img/logo.png">
				<h3>冷水江市格致教育</h3>
			</div>
			<notifier></notifier>
			<div class="home_body flex jlr">
				<banner></banner>
				<div class="home_body_tool">
					<div class="item icon1" @click="enterPage('gradeShow')"></div>
					<div class="item icon2" @click="$enter('/Ishop/Index')"></div>
					<!-- 页面跳转试试 -->
					<!-- <div class="item icon2" @click="handleJump"></div> -->
					<div class="item icon3" @click="enterPage('treasureShow')"></div>
				</div>
			</div>
		
			<div class="footer flex a-center">
				<span>京ICP备19042268号-3</span> 电信增值业务经营许可证：京B2-20211770 <span style="margin-left: 5px;">京公网安备 11011402011914号</span> <b @click="$enter('/Login/about')">关于我们</b>
			</div>
		</template>
		<transition name="el-fade-in-linear">
			<!--领取积分-->
			<grade v-if="gradeShow" @next="nextGrade" @back="close"></grade><!--输入学号-->
			<grade-list v-if="gradeListShow" @next="nextGradeList" @close="close" @back="backInclude"></grade-list><!--领取积分-->
			<grade-prize v-if="gradePrizeShow" @next="nextgradePrize"></grade-prize>
			<grade-meber v-if="gradeMeberShow" @exit="exit" @treasure="treasure" @record="record" @award="award"></grade-meber><!--我的-->
			
			<!--成长宝箱-->
			<treasure-chest v-if="treasureShow" @back="backTreasure" @next="nextTreasure"></treasure-chest><!--成长宝箱-->
			<treasure-detail v-if="treasureDetailShow" @back="backchest"></treasure-detail><!--成长宝箱待完成页面-->
			<treasure-prize v-if="treasurePrizeShow" @next="nextPrize"></treasure-prize><!--宝箱领取奖励页面-->
			
			<record v-if="recordShow" @claimRecord="claimRecord" @back="backRecord" @boxprize="boxprize" @boxdetail="boxdetail"></record><!--我的记录-->
			<sign-award v-if="awardShow" @back="backAward" @next="nextAward"></sign-award><!--签到有奖-->
			<more-award v-if="awardMoreShow" @back="backMoreAward"></more-award><!--签到有奖更多记录-->
		</transition>
	</div>
</template>

<script>
	import notifier from './notifier.vue'
	import banner from './banner.vue'
	import gradeMixins from './mixins/grade.mixins.js'
	import treasureMixins from './mixins/treasure.mixins.js'
	import recordMixins from './mixins/record.mixins.js'
	import awardMixins from './mixins/award.mixins.js'
	export default {
		name: 'home',
		mixins: [gradeMixins,treasureMixins,recordMixins,awardMixins],
		components: {
			banner,
			notifier
		},
		data() {
			return {
				recordNext:null,//用于记录上个弹出层
				newsList: [],
				static_uri: getApp().globalData.glb_list.config.static_uri, // 获取全局配置文件
				glbId: getApp().globalData.glb_list.glbId, // 获取全局的id
			}
		},
		mounted() {
			console.log('挂载', getApp().globalData)
		},

		methods: {
			handleJumpGrad() {
				uni.navigateTo({
            url: '/pages/Ishop/Index' 
				})
			},
			handleJump() {
				uni.navigateTo({
            url: '/pages/Ishop/Index' 
				})
			},
			enterPage(name){
				console.log('name', name )
				this.recordNext = null
				switch (name){
					case 'gradeShow':
						this.gradeShow = true
						break;
					case 'treasureShow':
						this.treasureShow = true
						break;
					default:
						break;
				}
				
			},
			close() { //关闭所有弹出层
				this.gradeShow = false
				this.gradeListShow = false
				this.gradeMeberShow = false
				this.treasureShow = false
				this.treasureDetailShow = false
				this.treasurePrizeShow = false
				this.recordShow = false
			},
		}
	}
</script>

<style scoped lang="scss">
	.home {
		padding: 0.15rem 0.3rem;
		width: 10.24rem;
		margin: auto;
	}

	.logo {
		font-size: 0.36rem;
		color: #353535;
		margin-left: 0.4rem;

		h3 {
			margin-left: 0.23rem;
		}
	}



	.home_body {
		padding-top: 0.23rem;

		.home_body_tool {
			flex: 1;
			padding-left: 0.65rem;

			.item {
				width: 1.7rem;
				height: 1.6rem;
				margin-bottom: 0.15rem;
				cursor: pointer;

				&.icon1 {
					background: url('../../assets/img/integral.png') no-repeat center center;
					background-size: contain;
				}

				&.icon2 {
					background: url('../../assets/img/ishop.png') no-repeat center center;
					background-size: contain;
				}

				&.icon3 {
					background: url('../../assets/img/treasure.png') no-repeat center center;
					background-size: contain;
				}
			}
		}
	}
</style>